<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../jquery/jquery-3.6.0.min.js"></script>
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/createStudent.css">
    <script src="../data/data.js"></script>

</head>
<body>
    <!--创建班级-->

    <div class="container ">

        <!--头部导航：首页 - 公共管理 - 意见管理-->
        <div class="row header-nav">
            <div>
                <p class="glyphicon glyphicon-home" aria-hidden="true"> 基础管理 - <span>学生管理</span></p>
            </div>

        </div>

        <!--中间主要数据部分-->
        <div class="container main-content">
            <div class="row">
                <form class="form-inline clearfix">

                    <div class="form-group">
                        <label for="student-name">学生姓名：</label>
                        <input type="email" class="form-control" id="student-name">
                    </div>
                    <div class="form-group">
                        <label for="student-id">学号：</label>
                        <input type="email" class="form-control" id="student-id" >
                    </div>
                    <button type="button" class="search btn btn-success">搜索</button>
                    <button type="button" class="openNewStudent btn btn-success  new-student-btn" data-toggle="modal" data-target="#openNewStudent">添加学生</button>
                </form>
            </div>

            <div class="row table-data">
                <table class="table table-bordered">
                    <thead>
                        <tr class="active">
                            <th>序号</th>
                            <th>学生姓名</th>
                            <th>学号</th>
                            <th>主班老师</th>
                            <th>性别</th>
                            <th>家长电话</th>
                            <th>所在班级</th>
                            <th>班级类型</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody class="student-data">
                        <!--<tr>
                            <td>001</td>
                            <td>001</td>
                            <td>001</td>
                            <td>001</td>
                            <td>001</td>
                            <td>001</td>
                            <td>001</td>
                            <td class="operate-data">
                                <button>查看</button>
                                <button>编辑</button>
                                <button>删除</button>
                            </td>
                        </tr>-->
                    </tbody>
                </table>

            </div>


        </div>

        <!-- 底部分页部分-->
        <div class="row">
            <div class="col-md-1 col-lg-1 total-number">
                共<span></span>条
            </div>
            <div class="col-md-2 col-lg-2">
                <select class="page-break col-md-12 col-lg-12 new-student page-number">
                    <option value="5">5条/页</option>
                    <option value="10" selected>10条/页</option>
                    <option value="15">15条/页</option>
                    <option value="20">20条/页</option>
                    <option value="50">50条/页</option>
                    <option value="100">100条/页</option>
                </select>
            </div>
            <div class="col-md-3 col-lg-3">
                <nav aria-label="Page navigation">
                    <ul class="pagination page clearfix">
                        <li class="previous">
                            <a href="#" aria-label="Previous">
                                <span aria-hidden="true">&laquo;</span>
                            </a>
                        </li>
                        <li>
                            <nav aria-label="Page navigation" style="display: inherit;">
                                <ul class="pagination choose-number">
                                    <!--<li><a href="#">1</a></li>
                                    <li><a href="#">2</a></li>
                                    <li><a href="#">3</a></li>
                                    <li><a href="#">4</a></li>
                                    <li><a href="#">5</a></li>-->
                                </ul>
                            </nav>
                        </li>

                        <li class="next">
                            <a href="#" aria-label="Next">
                                <span aria-hidden="true">&raquo;</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
            <div class="col-md-2 col-lg-2 leave">
                前往 <input class="leave-for" value="1"> 页
            </div>

        </div>





    </div>


    <!--新增学生弹框的实现-->
    <!-- Modal -->
    <div class="modal fade" id="openNewStudent" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog open-new-student" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">添加学生</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group">
                            <label for="openStudentName" class="col-sm-3 control-label">学生名字 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control openStudentName" id="openStudentName" placeholder="请输入学生名字" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="openMainTeacher" class="col-sm-3 control-label">主班老师<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <select class="col-sm-12 chooseMainTeacher new-student" id="openMainTeacher">
                                    <option selected>唐若思</option>
                                    <option>若思</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="openStudentSex" class="col-sm-3 control-label">学生性别<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <select class="col-sm-12 chooseStudentSex new-student" id="openStudentSex">
                                    <option selected>男</option>
                                    <option>女</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="openParentTel" class="col-sm-3 control-label">家长电话 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control openParentTel" id="openParentTel" placeholder="请输入家长电话号码" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="openStudentNativePlace" class="col-sm-3 control-label">籍贯 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control openStudentNativePlace" id="openStudentNativePlace" placeholder="请输入籍贯" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="openStudentIdNumber" class="col-sm-3 control-label">身份证号 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control openStudentIdNumber" id="openStudentIdNumber" placeholder="请输入学生身份证号" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="openParentWeixin" class="col-sm-3 control-label">家长微信 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control openParentWeixin" id="openParentWeixin" placeholder="请输入家长微信号" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="openStudentAddress" class="col-sm-3 control-label">家庭地址 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control openStudentAddress" id="openStudentAddress" placeholder="请输入学生家庭地址" required>
                            </div>
                        </div>





                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default cancel" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary confirm" data-dismiss="modal">确定</button>
                </div>
            </div>
        </div>
    </div>


    <!--查看弹框-->
    <div class="modal fade" id="studentView" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog open-new-class" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="view-information">查看学生信息</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group">
                            <label for="view-id" class="col-sm-3 control-label">学生id号 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view-id" id="view-id" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="view_name" class="col-sm-3 control-label">学生名字 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_name" id="view_name" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="view_teacher" class="col-sm-3 control-label">主班老师<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_teacher" id="view_teacher" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="view_assister" class="col-sm-3 control-label">副班老师<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_assister" id="view_assister" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="view_class_name" class="col-sm-3 control-label">所在班级<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_class_name" id="view_class_name" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="view_class_type" class="col-sm-3 control-label">班级类型<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_class_type" id="view_class_type" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="view_sex" class="col-sm-3 control-label">学生性别<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_sex" id="view_sex" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="view_tel" class="col-sm-3 control-label">家长电话 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_tel" id="view_tel" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="view_native_place" class="col-sm-3 control-label">籍贯 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_native_place" id="view_native_place" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="view_id_number" class="col-sm-3 control-label">身份证号 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_id_number" id="view_id_number" required disabled>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="view_weixin" class="col-sm-3 control-label">家长微信 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view_weixin" id="view_weixin" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="view-address" class="col-sm-3 control-label">家庭地址 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control view-address" id="view-address" required>
                            </div>
                        </div>





                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-dismiss="modal">确定</button>
                </div>
            </div>
        </div>
    </div>

    <!--删除时提示框-->
    <div class="modal fade" id="studentRemove" tabindex="-1" role="dialog" aria-labelledby="myModalLabel2">
        <div class="modal-dialog open-new-class" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
                <div class="modal-body">
                    删除后的数据将不可找回，您确定删除吗？
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">不，我再考虑一下</button>
                    <button type="button" class="btn btn-primary confirm-remove" data-dismiss="modal">是的，态度坚决</button>
                </div>
            </div>
        </div>
    </div>


    <!--编辑时出现弹窗-->
    <!-- Modal -->
    <div class="modal fade" id="studentCompile" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog open-new-class" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="class-compile">编辑学生信息</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group">
                            <label for="student_name" class="col-sm-3 control-label">学生名字 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control student_name" id="student_name" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="student_teacher" class="col-sm-3 control-label">主班老师<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <select class="col-sm-12 student_teacher new-student" id="student_teacher">
                                    <option selected>唐若思</option>
                                    <option>若思</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="student_sex" class="col-sm-3 control-label">学生性别<span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <select class="col-sm-12 student_sex new-student" id="student_sex">
                                    <option selected>男</option>
                                    <option>女</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="parent_tel" class="col-sm-3 control-label">家长电话 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control parent_tel" id="parent_tel" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="student_native_place" class="col-sm-3 control-label">籍贯 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control student_native_place" id="student_native_place" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="student_id_number" class="col-sm-3 control-label">身份证号 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control student_id_number" id="student_id_number" required disabled>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="parent_weixin" class="col-sm-3 control-label">家长微信 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control parent_weixin" id="parent_weixin" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="address" class="col-sm-3 control-label">家庭地址 <span class="important">*</span>:</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control address" id="address" required>
                            </div>
                        </div>





                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary sure-modify" data-dismiss="modal">确定</button>
                </div>
            </div>
        </div>
    </div>





    <script src="../bootstrap/js/bootstrap.min.js"></script>
    <script src="../js/createStudent.js"></script>
</body>
</html>